<script setup>
import {RouterView} from "vue-router";
import {Tabbar as VanTabbar, TabbarItem as VanTabbarItem} from 'vant';
import {useRouter} from 'vue-router'

const router = useRouter()
</script>

<template>
  <!--路由出口 所有的组件通过路由跳转 在此处显示 -->
  <RouterView/>
  <van-tabbar route>
    <van-tabbar-item to="/" icon="home-o">
      <span>工作台</span>
      <template #icon="props">
        <font-awesome-icon :icon="['fas', 'house']" />
      </template>
    </van-tabbar-item>
    <van-tabbar-item to="/report" icon="search">
      <span>报表</span>
      <template #icon="props">
        <font-awesome-icon :icon="['fas', 'display']" />
      </template>
    </van-tabbar-item>
    <van-tabbar-item to="/query" icon="friends-o">
      <span>查询</span>
      <template #icon="props">
      <font-awesome-icon :icon="['fas', 'magnifying-glass']" />
      </template>
    </van-tabbar-item>
    <van-tabbar-item to="/msg" icon="setting-o">
      <span>消息</span>
      <template #icon="props">
        <font-awesome-icon :icon="['far', 'bell']"/>
      </template>
    </van-tabbar-item>
  </van-tabbar>
</template>

<style scoped></style>
